<template>
  <td
    :rowspan="menu.childrenNum + 1"
    :class="{ 'active': activeId === menu.id }"
    @click="active(menu)"
  >
    {{ menu.title }}【{{ menu.perm }}】
    <a-tag v-if="!menu.status" color="error">禁用</a-tag>
  </td>
</template>
<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
  name: "MenuItem",
  props: {
    activeId: {
      type: Number,
      default: 0
    },
    menu: {
      type: Object,
      request: true,
    },
  },
  setup(props, { emit }) {
    const active = () => {
      emit("active", props.menu);
    };
    return {
      active,
    };
  },
});
</script>
<style lang="less" scoped>
</style>